<ul class="nav navMat"
    role="tablist">
  <li class="nav-item"
      class="matTab"
      *ngFor="let g of ms.game.materials.unlocked ; trackBy:getUnitId">

    <app-tab [id]="g.id"
             [isEnding]="g.isEnding"
             [name]="g.name"
             [quantity]="g.quantity"
             [perSec]="g.c"></app-tab>

  </li>
  <li *ngIf="ms.game.firstEndingUnit">

    <clr-alert [clrAlertClosable]="false"
               [clrAlertType]="ms.game.firstEndingUnit.endIn < 3600000 ? 'alert-danger':'alert-warning'">
      <div clr-alert-item
           class="alert-item">
        <span class="alert-text">
          {{ms.game.firstEndingUnit.name}} 将在 {{ms.game.firstEndingUnit.endIn | endIn}} 后消耗完
        </span>
      </div>
    </clr-alert>

  </li>
</ul>
